<script src="test/calender_date_picker.js" type="text/javascript" language="javascript"></script>
<link rel="stylesheet" type="text/css" media="screen,projection" href="test/calender.css" />
<form>
<input type='text' name='datum1'><a href='#' onClick="setYears(1930, 2015); showCalender(this, 'datum1');"><img src='images/calender.png' border='0'></a>
</form>
<!-- This code is just to display the calendar, it must be under the body level directly  -->
<table id="calenderTable">
<tbody id="calenderTableHead">
<tr>
 <td colspan="4" align="left">
	<select onChange="showCalenderBody(createCalender(document.getElementById('selectYear').value, this.selectedIndex, false));" id="selectMonth">
	 <option value="0">January</option>
	 <option value="1">February</option>
	 <option value="2">March</option>
	 <option value="3">April</option>
	 <option value="4">May</option>
	 <option value="5">June</option>
	 <option value="6">July</option>
	 <option value="7">August</option>
	 <option value="8">September</option>
	 <option value="9">October</option>
	 <option value="10">November</option>
	 <option value="11">December</option>
	</select>
 </td>
 <td colspan="2" align="center"><select onChange="showCalenderBody(createCalender(this.value, document.getElementById('selectMonth').selectedIndex, false));" id="selectYear"></select></td>
 <td align="right"><a href="#" onClick="closeCalender();">X</a></td>
</tr>
</tbody>
<tbody id="calenderTableDays">
<tr style="">
 <td>Su</td><td>Mo</td><td>Tu</td><td>We</td><td>Thu</td><td>Fr</td><td>Sa</td>
</tr>
</tbody>
<tbody id="calender"></tbody>
</table>
<!-- This is the end of the calendar code  -->